Наткнулся не так давно на шикарный анимационный сериал - Love.Death.&.Robots. Давно такого удовольствия не получал.

Досмотрел последний эпизод (там независимые короткометражки). Самый безумный из всех, наверно - Jibaro

#video #offtop

Статья о современном минимальном наборе фавиконок для сайта

<link rel="icon" href="/favicon.ico" sizes="any"><!-- 32×32 -->
<link rel="icon" href="/icon.svg" type="image/svg+xml">
<link rel="apple-touch-icon" href="/apple-touch-icon.png"><!-- 180×180 -->
<link rel="manifest" href="/manifest.webmanifest">

// manifest.webmanifest
{
   "icons": [
       { "src": "/icon-192.png", "type": "image/png", "sizes": "192x192" },
       { "src": "/icon-512.png", "type": "image/png", "sizes": "512x512" }
   ]
}

#webdev

Почему неконтролируемого использования watch лучше избегать?

1. Нарушение реактивного потока

watch часто скрывает логику реактивности. Например, отслеживание изменения переменной для вызова побочного эффекта (fetch) делает поток данных менее предсказуемым, особенно если эффекты затрагивают несколько компонентов.

Vue поощряет однонаправленную реактивность (данные -> шаблон). watch часто используется для обратной связи (данные -> данные), что усложняет отладку.

2. Плохая читаемость

Цепочки watch внутри компонента превращаются в плохо понимаемый в спагетти-код.

Плохо для рефакторинга - логика, разбросанная по watch, сложно переносится в composables.

3. Производительность

watch с deep: true может создать нагрузку при отслеживании больших объектов или массивов.

watch часто дублирует логику, которую можно выразить через computed. Вычисляемые свойства кешируются и эффективнее.

Неотписанные watch в динамических компонентах (например, внутри v-if) могут накапливаться и вызывать утечки памяти.


watch — это аварийный выход для случаев, когда декларативных подходов недостаточно. Если возможно, нужно старайться решить задачу через computed, props или события.

#reactivity #watch

Продолжаем подкасты с Деми Мурычем

Про let и const

#murych #audio

В конце каждого поста я ставлю хэштеги. Не все, оказалось, знают, что это не просто для красоты или декларативной категоризации

Кликните на какой-нибудь и увидите, почему Telegram на голову выше других известных мессенджеров и соцсетей

По ним же можно искать

#tip #telegram

Представитель hh.ru согласился дать интервью каналу

Задавайте вопросы и запросы, какие темы осветить. Любые.

#interview #hh #job

Все, кто имет отношение, приглашаются пройти исследование русскоязычных продакт-менеджеров — 2025

Команда DevCrowd в четвёртый раз запускает исследование, чтобы понять, как живётся продактам:

– что входит в зону ответственности продакта в компаниях разного размера,
– какие навыки востребованы и чего не хватает,
– как и где продакты учатся и растут,
– какие инструменты и подходы реально работают,
– сколько получают и сколько хотят получать специалисты на разных грейдах.

https://survey.alchemer.eu/s3/90815016/dvcrowd-product-2025

Подробней на канале Тиграна Басеяна о продакт менеджменте и стартапах

#offtop

Обычно для группировки массива по какому-то ключу используют reduce

Однако уже доступны Object.groupBy и Map.groupBy, которые позволяют упростить эту процедуру

const users = [
  { id: 1, name: "Alex", role: "admin" },
  { id: 2, name: "Anna", role: "user" },
];

const grouped = Object.groupBy(users, ({ role }) => role);

// Результат:
// { admin: [{...}], user: [{...}] }

#js

Ради интереса выставил своего Аргуса на конкурс проектов на Product Radar

Кому бот понравился - поддержите голосом (надо залогиниться на сайт).

Хейтеры могут поддержать соперников. Можно сразу всех вместе.

#argus #productradar #contest

pollinations.ai - правильный API для AI:

GET https://text.pollinations.ai/{prompt}

<img 
    src="https://image.pollinations.ai/prompt/Reactjs%20is%20dying" 
    alt="A beautiful picture"
/>

Другие варианты тут

P.S. На картинке генерация DALL-E 3 с промптом из кодблока

Кстати, где можно генерить качественные картинки - https://www.tg-me.com/neuralforum/5300857

#ai

По большому счету технически SPA - это в основном router

В этой статье показывается пример, как реализовать router на чистом js

С Hash Mode и History Mode

#spa #router

Когда твой сайт делал креативный UX дизайнер

#ux #humor #meme

С праздником!

#gagarin

Окунулся я в сферу стартапов

Страшный это мир...

#startup #meme

Техническую документацию часто оформляют как отдельный репозиторий. Но сейчас удобней ее иметь в каждом проекте, чтобы генерить с помощью AI доку из контекста текущего репозитория.

Кроме монорепы, git submodules и других наворотов для решения этой задачи есть еще один - `ln -s`

Символьная ссылка на docs директорию в другие проекты не захламляет git, но тот же Cursor отлично видит её содержимое.

Параллельное составление актуальной документации полезно еще и тем, что IDE AI может использовать ее как часть контекста (не надо по 10 раз объяснять, как тут что работает)

Так же IDE AI можно научить при необходимости обновлять документацию после каждого рефакторинга

#ai #ide #documentation

Контейнерные запросы (Container Queries) — это инструмент в CSS, который позволяет стилизовать элементы на основе размеров их родительского контейнера, а не всего окна браузера. В Chrome 133 появилась новая фича — scroll states для контейнерных запросов, которая добавляет ещё больше контроля над поведением элементов.

Что такое Scroll States?

scrollable, stuck и snapped - это новые условия свойства scroll-state, которые можно использовать внутри @container, чтобы применять стили в зависимости от состояния прокрутки контейнера:


Пример:

.stuck-top {
  container-type: scroll-state;
  position: sticky;
  top: 0px;

  > nav {
    @container scroll-state(stuck: top) {
      background: _Highlight;
      color: _HighlightText;
    }
  }
}

Где это можно использовать?

- Индикация прокрутки — визуально показывать, что есть ещё контент ниже
- "Липкие" заголовки — автоматически делать заголовки sticky при прокрутке
- Изменение навигации — например, показывать кнопку "Наверх" при прокрутке
- Оптимизация интерфейса — скрывать второстепенные элементы при прокрутке

Документация

#chrome #css

За долгие годы у меня было несколько миграций с браузера на браузер. Сейчас Chrome, перед ним были Vivaldi и Brave, и вот думаю об Edge, потому что Chrome ну что-то прям сильно часто стал не показывать то, что нормально показывает Edge.

Вообще переход на Chromium у MS был очень грамотный шаг

Embrace, extend, and extinguish

#chrome #ms